import { defineConfig, loadEnv } from "vite";
import vue from "@vitejs/plugin-vue";
import path from "path";
import AutoImport from "unplugin-auto-import/vite";
import Components from "unplugin-vue-components/vite";
import { AntDesignVueResolver } from "unplugin-vue-components/resolvers";
import { theme } from "ant-design-vue";

const { defaultAlgorithm, defaultSeed } = theme;
const mapToken = defaultAlgorithm(defaultSeed);

export default defineConfig(({ mode }) => {
  const env = loadEnv(mode, process.cwd(), "VITE_");
  return {
    plugins: [
      vue(),
      AutoImport({
        imports: ["vue", "vue-router", "pinia"],
        dts: "types/auto-imports.d.ts",
      }),
      Components({
        resolvers: [
          AntDesignVueResolver({
            importStyle: "less",
            resolveIcons: true,
            prefix: "A",
          }),
        ],
        dts: "types/components.d.ts",
      }),
    ],
    server: {
      host: "0.0.0.0",
      port: 8090,
      proxy: {
        "/dev-api": {
          target: env.VITE_BASE_URL,
          changeOrigin: true,
        },
      },
    },
    resolve: {
      alias: {
        "@": path.resolve(__dirname, "./src"),
      },
    },
    css: {
      preprocessorOptions: {
        less: {
          loader: "less-loader",
          api: "modern-compiler",
          additionalData: `@import "@/styles/init.less";`,
          javascriptEnabled: true,
          options: {
            lessOptions: {
              modifyVars: mapToken,
            },
          },
        },
      },
    },
  };
});
